{% extends 'base.html' %}
{% block title %}
    <title>{{ books.title }}</title>
{% endblock %}

{% block css %}
<style>
.comment_section{
    border-bottom: 1px solid rgb(121, 121, 121);
}
</style>
{% endblock %}

{% block js %}
<script>

</script>
{% endblock %}

{% block body %}
<h1>{{ chapter.title }}</h1>

    <div class="navigation">
        {% if previous_chapter %}
            <a href="{% url 'main:chapter_detail' book_id=books.id chapter_id=previous_chapter.id %}">上一章</a>
        {% endif %}

        {% if next_chapter %}
            <a href="{% url 'main:chapter_detail' book_id=books.id chapter_id=next_chapter.id %}">下一章</a>
        {% endif %}
    </div>
    <div>
        <div class="comment_section"><h3>评论区</h3></div>
        <ul>
            {% for comment in comments %}
                <li><strong style="color:green;">{{ comment.user.username }}</strong>: {{ comment.content }} ({{ comment.created_at|date:"Y-m-d H:i" }})</li>
            {% empty %}
                <li style="font-size: 12px; color: gray;">还没有评论，快来抢沙发！</li>
            {% endfor %}
        </ul>
    </div>
    <form method="post">
        {% csrf_token %}
        <div style="color:grey;">{{ form.as_p }}</div>
        <button type="submit" class=" btn-success">发表</button>
    </form>


{% endblock %}